<template>
  <div class="like">
    <div class="like_top">
      <img class="mp-title-img" src="https://imgs.qunarzz.com/piao/fusion/1711/89/ebc329f16c55bb02.png" alt="猜你喜欢">
      <span class="mp-title">猜你喜欢</span>
    </div>
    <ul>
      <li class="like_list border_bottom" v-for="item in liskList" :key="item.id" @click='toDetails'>
        <div class="like_img">
          <img :src="item.imgUrl" alt="">
    		</div>
          <div class="like_text">
            <div class="like_title">{{item.tite}}</div>
            <div class="like_message">{{item.message}}</div>
            <div class="like_map">
              <span>￥<b>{{item.price}}</b></span>起
              <span>{{item.address}}</span>
            </div>
          </div>
      </li>
    </ul>
  </div>
</template>
<script type="text/javascript">
	export default{
     props:['liskList'],
		data(){
			return{
				
			}
		},
    methods:{
      toDetails(){
        this.$router.push('/details');
      }
    }
	}
</script>
<style scoped="" lang="scss">
.like {
  background: #fff;
  margin-top: 0.2rem;
  font-size: 0.28rem;
  padding: 0 0.2rem;

  .like_top {
    position: relative;
    font-size: 0.28rem;
	padding:0.2rem 0;
    .mp-title-img {
      width: .3rem;
      height: .3rem;
      margin-left: .2rem;
    }

    span {
      color: #212121;
      font-size: 0.32rem;
    }
  }

  .like_list {
    position: relative;
    overflow: hidden;
    padding: 0.2rem 0;

    .like_img {
      float: left;

      img {
        width: 2.0rem;
        height: 2.0rem;
      }
    }

    .like_text {
      padding-left: 0.22rem;
      overflow: hidden;

      .like_title {
        font-size: 0.36rem;
        color: #212121;
        margin-top: .26rem;
      }

      .like_message {
        margin-top: .2rem;
        color: #616161;
        font-size: 0.24rem;
      }

      .like_map {
        margin-top: .3rem;
        color: #616161;
        font-size: .24rem;
		position:relative;
        span:first-child {
          color: #ff8300;

          b {
            font-size: .4rem;
            font-weight: normal;
          }
        }
        span:last-child{
        	position:absolute;
        	right: 0;
        	bottom: 0;
        }
      }
    }
  }
}

</style>
